$(function() {

	var shoplistArr = JSON.parse(CookieTools.getCookieByName("shoplist") || '[]')
	console.log(shoplistArr)

	// shoplistArr.forEach(function(el,index){
	// 	// console.log(el)
	// 	// var oImg=`<a href='#'><img src='${el.imgstr}'></a>`
	// 	// $(".listimg").append(oImg)
	// 	var $UL=$(".addBoxul").clone(true)
	// 	$(".addBox").append($UL)
	// })
	for (var i in shoplistArr) {
		// console.log(shoplistArr[i])

		var $UL =
			`<ul class="clearFix addBoxul">
										<li><span class="selectImg selectAll"></span></li>
										<li>
											<p class="listimg">
												 <a href="#"> 
												 <img src="${shoplistArr[i].imgstr}" alt=""> 
												 </a> 
											</p>
											<div class="listtxt">
												<span><a href="#">${shoplistArr[i].title}</a></span>
												<span><a href="#">${shoplistArr[i].txt}</a></span>
												<div class="describte clearFix">
													<div class="describteLeft">
														<span>颜色:${shoplistArr[i].color}</span>
														<span>尺寸:${shoplistArr[i].size}</span>
													</div>
													<div class="btnRight">
														<span class="changeMess">修改</span>
													</div>
													<div class="hidechange">
														<div class="changetop">
															<div class="topimg"></div>
														</div>
														<div class="changebtm">
															<div class="closeimg"></div>
															<div class="datachange clearFix">
																<div class="tiltetxt">尺寸</div>
																 <ul class="clearFix sizelist">
																
																 </ul>
															</div>
															<div class="surebtn">确定</div>
														</div>
													</div>
												</div>
											</div>
										</li>
										<li class="itemprice">
											<p>￥${shoplistArr[i].price}.00</p>
										</li>
										<li class="choosenum">
											<div class="choose">
												<span class="remove">-</span>
												<span><input class="shopnum" type="text" value="${shoplistArr[i].num}" readonly ></span>
												<span class="add">+</span>
											</div>
										</li>
										<li>￥0.00</li>
										<li class="total">￥${shoplistArr[i].total}.00</li>
										<li>
											<div class="deletea">删除</div>
										</li>
									</ul>`
		$(".addBox").append($UL)
		for (var j = 0; j < shoplistArr[i].sizeArr.length; j++) {
			console.log(shoplistArr[i].sizeArr)
			// <ul class="clearFix">
			// 	<li><a href="#" class="selecteddata size">S</a></li>
			// 	<li><a href="#" class="size">M</a></li>
			// 	<li><a href="#" class="size">L</a></li>
			// </ul>
			var $LI = `<li><a href="#" class="size">${shoplistArr[i].sizeArr[j]}</a></li>`
			// $($UL).find(".sizelist").append($LI)
			console.log($LI)
			$(".sizelist").append($LI)
		}


		// console.log($($UL).find(".sizelist"))

	}
	// 购物车添减数量
	var $remove = $(".addBox").find(".remove")
	var $add = $(".addBox").find(".add")
	console.log($remove)

	$remove.each(function(index, el) {
		$(el).on("click", function() {
			$(this).next().find(".shopnum").val($(this).next().find(".shopnum").val() - 1)
			if ($(this).next().find(".shopnum").val() <= 1) {
				$(this).next().find(".shopnum").val("1")
			}
		})
	})
	$add.each(function(index, el) {
		$(el).on("click", function() {
			$(this).prev().find(".shopnum").val(Number($(this).prev().find(".shopnum").val()) + 1)
		})
	})

	// 删除操作
	var $deleteA = $(".addBox").find(".deletea")
	$deleteA.each(function(index, el) {
		$(el).on("click", function() {
			$(this).parents("ul").remove()
		})
	})

	// 打开修改size信息
	var $changesize = $(".addBox").find(".size")
	var $changeMess = $(".addBox").find(".changeMess")
	$changeMess.each(function(index, el) {
		$(el).on("click", function() {
			$(this).parent(".btnRight").next(".hidechange").show()
			// 获取原来数据库里的数据
			var sizeStr = $(this).parent(".btnRight").prev(".describteLeft").children("span").eq(1).text().split(":")[1]
			// var $Size=$(".addBox").find(".changeMess")
			$changesize.each(function(index, el) {

				if ($(el).text() == sizeStr) {
					var flag = $(el).parent("li").siblings().children("a").hasClass("selecteddata")
					if (!flag) {
						$(el).addClass("selecteddata")
					}
				}

			})
		})
	})

	// 关闭修改信息
	var $closeChangemess = $(".addBox").find(".closeimg")
	$closeChangemess.each(function(index, el) {
		$(el).on("click", function() {
			$(this).parents(".hidechange").hide(200)
		})
	})

	//选择修改size
	$changesize.each(function(index, el) {
		$(el).on("click", function() {
			$(this).addClass("selecteddata").parent("li").siblings().children("a").removeClass("selecteddata")

		})
	})

	//按确定键修改size
	var $sizeSure = $(".addBox").find(".surebtn")
	$sizeSure.each(function(index, el) {
			$(el).on("click", function() {
					$changesize.each(function(index, ele) {
							var flag = $(ele).hasClass("selecteddata")
							if (flag) {
								$(this).parents(".hidechange").siblings(".describteLeft").children("span").eq(1).text("尺寸:"+$(ele).text())
							}
						})

					})
			})
	

})
